import React, { Component } from 'react';
import ReactDOM from 'react-dom';

class Popup extends Component {
  constructor (props) {
    super(props);
    this.state = {
      isActive: false
    };
  }
  componentDidUpdate (prevProps, prevState) {
    if (!this.state.isActive && prevState.isActive) {
      document.removeEventListener('click', this.hidePopup);
    }
    if (this.state.isActive && !prevState.isActive) {
      document.addEventListener('click', this.hidePopup);
    }
  }
  componentWillUnmount () {
    document.removeEventListener('click', this.hidePopup);
  }
  hidePopup (e) {
    if (!this.isMounted()) return false;
    const node = ReactDOM.findDOMNode(this);
    const target = e.target || e.srcElement;
    const isInside = node.contains(target);
    if (this.state.isActive && !isInside) {
      this.setState({
        isActive: false
      });
    }
  }
  render() {
    return (
      <div></div>
    );
  }

}

export default Popup;
